<template>
  <div class="View">
    <!-- tab切换菜单 -->
    <el-tabs v-model="activeName" @tab-click="handleClick" :before-leave="beforeLeaveFn" class="bh-tab">
      <el-tab-pane :label="$t('message.bhView.tab.name4')" name="fourth">
      </el-tab-pane>
      <el-tab-pane :label="$t('message.bhView.tab.name5')" name="fifth">
      </el-tab-pane>

      <el-tab-pane :label="$t('message.bhView.tab.name1')" name="first">
      </el-tab-pane>
      <el-tab-pane :label="$t('message.bhView.tab.name2')" name="second">
      </el-tab-pane>
      <el-tab-pane :label="$t('message.bhView.tab.name3')" name="third">
      </el-tab-pane>
      <el-tab-pane :label="$t('message.bhView.tab.name6')" name="sixth">
      </el-tab-pane>
    </el-tabs>
    <div class="all-content-warrper">
      <!-- 打印 、 编辑、 装置名称那栏目 坑坑坑~~~~~~~~~~ -->
      <div class="title-view">
        <div class="top-btn-view">
          <div class="btn-box">
            <!-- 头部下拉菜单 -->
            <div v-for="(downItem, index) in activeName == 'first'
              ? topBtnDownList
              : activeName == 'second'
                ? topMsBtnDownList
                : activeName == 'third'
                  ? topMsDetailBtnDownList
                  : activeName == 'fourth'
                    ? topYLBtnDownList
                    : activeName == 'fifth'
                      ? topBSDownList
                      : activeName == 'sixth'
                        ? sixthDetailBtnDownList
                        : []" :key="index">
              <el-dropdown>
                <span class="el-dropdown-link">
                  <button @click="BtnActive(index)" :class="index == downBtnActiveX
                    ? 'tab-btn downBtnActive'
                    : 'tab-btn'
                    ">
                    <!-- {{ $t("message.bhView.btnName.titleBtn") }} -->
                    {{ downItem.topBtnName }}
                  </button>
                </span>
                <el-dropdown-menu slot="dropdown">
                  <el-dropdown-item v-for="(dropdownItem, dropdownIndex) in downItem.downList" :key="dropdownIndex"
                    @click.native="dropDownMenu(dropdownItem, downItem.type)" :disabled="!dropdownItem.disabled"
                    class="drop-btn">
                    <button :disabled="!dropdownItem.disabled" class="drop-btn">
                      {{ dropdownItem.itemName }}
                    </button>
                  </el-dropdown-item>
                </el-dropdown-menu>
              </el-dropdown>
            </div>
          </div>
          <div class="bottom">
            <div class="bottom-left-view">
              <div class="b-input">
                <div class="b-input-label">
                  {{ $t("message.bhView.label.Plant") }}
                </div>
                <!-- 装置名称 -->
                <el-input v-model="$store.state.plantName" class="selectInput" readonly></el-input>
              </div>
              <div class="b-input">
                <div class="b-input-label">
                  {{ $t("message.bhView.label.jqName") }}
                </div>
                <!-- macName -->
                <el-input v-model="$store.state.macNameb" clearable
                  :placeholder="$t('message.bhView.label.placeholder')" class="selectInput" readonly></el-input>
                <!-- 机器名称长name -->
                <el-input v-model="$store.state.macName" clearable :placeholder="$t('message.bhView.label.placeholder')"
                  class="selectInput selectInputlong" readonly></el-input>
              </div>
              <!-- <div class="DViewer">
                <el-tooltip
                  class="item"
                  effect="dark"
                  :content="$t('message.tooltip.title_1')"
                  placement="top"
                >
                  <i class="iconfont" @click="changeToScene">&#xe8e6;</i>
                </el-tooltip>
              </div> -->

            </div>
            <div class="bottom-right-view" v-if="activeName == 'fourth'">
              <el-button type="primary" style="width: 100px;line-height: 0px;" @click="panorFn"
                :disabled="styleOptionsValue != 3">
                全体図
              </el-button>
            </div>
            <!-- 编辑 阅览 -->
            <div class="bottom-right-view" v-if="activeName != 'fourth'">
              <el-button class="bg-bottom-btn" @click="onToMarkClick" v-if="$hasEditPermission('/BHView')" type="primary"
                :disabled="activeName != 'fifth' ? false : $store.state.baseTab5Flg == 5 ? false : true">
                {{ $t("message.bhView.topBtnDownList.markup_edit") }}
              </el-button>
              <!-- <button class="bg-bottom-btn">
                {{ $t("message.bhView.topBtnDownList.reading") }}
              </button> -->
              <!-- <button class="edit-btn">
                {{ $t("message.bhView.topBtnDownList.edit") }}
              </button> -->
            </div>
          </div>
        </div>
      </div>
      <!-- 左侧表格以及右上表格还有折线图显示区 -->
      <div class="leftTabel-rightTabel-lineContent">
        <div class="left" v-show="activeName != 'fourth' ||
          (activeName == 'fourth' && styleOptionsValue == 3)
          ">
          <LeftContent ref="LeftContent" @changePlanValue="changePlanValue" @ClickTableRow="getTableRow"
            @ClickReadTableRow="getReadTableRow" :numberData="numberData" @clearBhTabel="clearBhTabel"
            @ClearDataFunction="ClearDataFunction" :activeName="activeName" :styleOptionsValue="styleOptionsValue">
          </LeftContent>
        </div>
        <!-- ------ 'wide-right right':'right'-->
        <div :class="activeName === 'fourth'
          ? styleOptionsValue == 3
            ? 'right'
            : 'wide-right right'
          : 'right'
          ">
          <BHCompontens ref="BHCompontensView" :leftTabelRow="leftTabelRow" @getNumberData="getNumberData"
            @changeBtnTxt="changeBtnTxt" :valuePlant="valuePlant" :macName="macName" v-if="activeName === 'first'">
          </BHCompontens>
          <BSCompontens v-if="activeName === 'fifth'" :activeName="activeName"></BSCompontens>
          <MSCompontens v-if="activeName === 'second'" :leftTabelRow="leftTabelRow" @getNumberData="getNumberData">
          </MSCompontens>
          <MSDetailCompontens v-if="activeName === 'third'" :leftTabelRow="leftTabelRow" @getNumberData="getNumberData">
          </MSDetailCompontens>
          <SixthCompontens v-if="activeName === 'sixth'" ref="SixthCompontensRef" :leftTabelRow="leftTabelRow"
            @getNumberData="getNumberData" @changeCheckBox="changeCheckBox">
          </SixthCompontens>
          <ReadingCompontens ref="readingCompontens" :leftReadTabelRow="leftReadTabelRow" v-if="activeName === 'fourth'"
            @getNumberData="getNumberData" @getMacName="getMacName" @changeRadioSelect="changeRadioSelect"
            @ChangeSelectViewValue="ChangeSelectViewValueFun"></ReadingCompontens>
        </div>
      </div>
    </div>
    <!-- 表示=》第一项 -->
    <DAView :DAFlg="DAFlg" @CloseTabelDialog="DAFlg = false" v-if="DAFlg"></DAView>
    <DDView :DDFlg="DDFlg" @CloseTabelDialog="DDFlg = false" v-if="DDFlg"></DDView>
    <CBView :CBFlg="CBFlg" @CloseTabelDialog="CBFlg = false" v-if="CBFlg"></CBView>
    <!-- 表格宽高等显示弹窗设置 -->
    <BHTabelCompontens :TabelCompontensFlag="TabelCompontensFlag" @CloseTabelDialog="TabelCompontensFlag = false"
      v-if="TabelCompontensFlag"></BHTabelCompontens>
    <!-- 添附资料 -->
    <AdditionalInformation @CloseDialogAddtion="AdditionalInformationFlag = false"
      :AdditionalInformationFlag="AdditionalInformationFlag"></AdditionalInformation>
    <!-- 图表设定 -->
    <ChartsConfig :ChartsConfigFlag="ChartsConfigFlag" @CloseChartsConfig="ChartsConfigFlag = false"
      v-if="ChartsConfigFlag"></ChartsConfig>
    <!-- 目视宽高等显示弹窗设置 -->
    <MSTabelCompontens :MSTabelCompontensFlag="MSTabelCompontensFlag"
      @CloseMSTabelDialog="MSTabelCompontensFlag = false" v-if="MSTabelCompontensFlag"></MSTabelCompontens>
    <!-- 目视详细宽高显示弹窗设置 -->
    <MSDetailTabelCompontens :MSDetailTabelCompontensFlag="MSDetailTabelCompontensFlag"
      v-if="MSDetailTabelCompontensFlag" @CloseMSDetailTabelDialog="MSDetailTabelCompontensFlag = false">
    </MSDetailTabelCompontens>
    <MSInspectTabelCompontens :MSDetailTabelCompontensFlag1="MSDetailTabelCompontensFlag1"
      v-if="MSDetailTabelCompontensFlag1" @CloseMSDetailTabelDialog="MSDetailTabelCompontensFlag1 = false">
    </MSInspectTabelCompontens>

    <!-- 机器别计划 -->
    <sixthDetailTabelCompontens :sixthDetailTabelCompontensFlag="sixthDetailTabelCompontensFlag"
      v-if="sixthDetailTabelCompontensFlag" @CloseMSDetailTabelDialog="sixthDetailTabelCompontensFlag = false">
    </sixthDetailTabelCompontens>
    <sixthInspectTabelCompontens :sixthDetailTabelCompontensFlag1="sixthDetailTabelCompontensFlag1"
      v-if="sixthDetailTabelCompontensFlag1" @CloseMSDetailTabelDialog="sixthDetailTabelCompontensFlag1 = false">
    </sixthInspectTabelCompontens>

    <!-- 阅览表格宽高显示弹窗设置 -->
    <ReadingTabelCompontens :ReadingTabelCompontensFlag="ReadingTabelCompontensFlag"
      @CloseReadingTabelDialog="ReadingTabelCompontensFlag = false" v-if="ReadingTabelCompontensFlag">
    </ReadingTabelCompontens>

    <!-- 基本式样添加 机器-->
    <AddBasicStyleMachine v-if="AddBasicStyleIsShow" @CloseAddBasicStyle="AddBasicStyleIsShow = false" />

    <!-- 基本样式添加 配管 -->
    <AddBasicStylePiping v-if="AddBasicStylePipingIsShow"
      @ClsoeAddBasicStylePiping="AddBasicStylePipingIsShow = false" />

    <!-- 全景图 -->

    <transition name="el-zoom-in-center">
      <PanOrView ref="PanOrViewRef" v-show="panorShow" class="panor" @panorFn="panorFn"></PanOrView>
    </transition>



  </div>
</template>

<script>
import LeftContent from "../components/LeftContent/index";
import BHCompontens from "../components/TabelLineCadViews/BHCompontens";
import MSCompontens from "../components/TabelLineCadViews/MSCompontens";
import MSDetailCompontens from "../components/TabelLineCadViews/MSDetailCompontens";
import SixthCompontens from "../components/TabelLineCadViews/SixthCompontens";
import ReadingCompontens from "../components/TabelLineCadViews/ReadingCompontens";
import DAView from "../components/TabelLineCadViews/BHDialogCompontens/D_A";
import DDView from "../components/TabelLineCadViews/BHDialogCompontens/D_D";
import CBView from "../components/TabelLineCadViews/BHDialogCompontens/C_B";
import BHTabelCompontens from "../components/TabelLineCadViews/BHDialogCompontens/TabelCompontens";
import MSTabelCompontens from "../components/TabelLineCadViews/MSDialogCompontens/TabelCompontens";
import MSDetailTabelCompontens from "../components/TabelLineCadViews/MSDetailDialogCompontens/TabelCompontens";
import MSInspectTabelCompontens from "../components/TabelLineCadViews/MSDetailDialogCompontens/MSInspectTabelCompontens";

import sixthDetailTabelCompontens from "../components/TabelLineCadViews/MSDetailDialogCompontens/sixthTabelCompontens";
import sixthInspectTabelCompontens from "../components/TabelLineCadViews/MSDetailDialogCompontens/sixthInspectTabelCompontens";

import ReadingTabelCompontens from "../components/TabelLineCadViews/ReadingDialogCompontens/TabelCompontens";
import BSCompontens from "../components/TabelLineCadViews/BasicStyleCompontens.vue";

import AddBasicStyleMachine from "../components/TabelLineCadViews/BSDialogCompontens/addBasicStyleMachine";
import AddBasicStylePiping from "../components/TabelLineCadViews/BSDialogCompontens/addBasicStylePiping";

import AdditionalInformation from "../components/TabelLineCadViews/BHDialogCompontens/AdditionalInformationCps";
import ChartsConfig from "../components/TabelLineCadViews/BHDialogCompontens/ChartsConfig";

import PanOrView from "./PanOrView.vue"
import $ from "jquery";
import eventBus from "../eventBus/bus";
import { getLocalStorage } from "@/utils/storage";

import { showLoading, hideLoading } from "@/utils/loading";

import { getMachineDwgId } from "@/api/api";

// 导出模块
export default {
  // 模块名字
  name: "BHView",
  // 模块数据
  data() {
    //数据
    return {
      isNavLeave: false,
      panorShow: false,
      userData: getLocalStorage('userData'),
      activeName: "fourth",
      // 肉厚測定経歴
      topBtnDownList: [
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.printing"),
        //   type: "BH",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.bhReport"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.msReport"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.edit"),
        //   type: "BH",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.annualAddition"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t(
        //     //     "message.bhView.topBtnDownList.replacementRegistration"
        //     //   ),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.checkComments"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        {
          topBtnName: this.$t("message.bhView.topBtnDownList.data"),
          type: "BH",
          downList: [
            // {
            //   itemName: this.$t(
            //     "message.bhView.topBtnDownList.additionalInformation"
            //   ),
            //   disabled: false,
            // },
            // {
            //   itemName: this.$t("message.bhView.topBtnDownList.processing"),
            //   disabled: false,
            // },
            {
              itemName: this.$t(
                "message.bhView.topBtnDownList.errorAlarmValue"
              ),
              disabled: true,
            },
            // {
            //   itemName: this.$t(
            //     "message.bhView.topBtnDownList.wallThicknessPattern"
            //   ),
            //   disabled: false,
            // },
            // {
            //   itemName: this.$t(
            //     "message.bhView.topBtnDownList.replacementRegistration"
            //   ),
            //   disabled: false,
            // },
            // {
            //   itemName: this.$t("message.bhView.topBtnDownList.export"),
            //   disabled: false,
            // },
          ],
        },
        {
          topBtnName: this.$t("message.bhView.topBtnDownList.view"),
          type: "BH",
          downList: [
            {
              itemName: this.$t("message.bhView.topBtnDownList.pointDisplay"),
              disabled: true,
            },
            {
              itemName: this.$t(
                "message.bhView.topBtnDownList.selectDisplayItems"
              ),
              // disableByResult: false,
              disabled: true,
            },
            {
              itemName: this.$t("message.bhView.topBtnDownList.chartSetting"),
              // disableByResult: false,
              disabled: true,
            },
            // {
            //   itemName: this.$t("message.bhView.topBtnDownList.sort"),
            //   disabled: false,
            // },
            {
              itemName: this.$t("message.bhView.topBtnDownList.ballSwitch"),
              disabled: true,
            },
          ],
        },
      ],
      // 目視/非破壊経歴（要約）
      topMsBtnDownList: [
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.printing"),
        //   type: "MS",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.print_preview"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.edit"),
        //   type: "MS",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.addition"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.delete"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.detail"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.markup"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.data"),
        //   type: "MS",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.processing"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        {
          topBtnName: this.$t("message.bhView.topBtnDownList.view"),
          type: "MS",
          downList: [
            {
              itemName: this.$t(
                "message.bhView.topBtnDownList.selectDisplayItems"
              ),
              // disableByResult: true,
              disabled: true,
            },
            // {
            //   itemName: this.$t("message.bhView.topBtnDownList.selectCheck"),
            //   disabled: false,
            // },
          ],
        },
      ],
      // 目視/非破壊経歴（詳細）
      topMsDetailBtnDownList: [
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.printing"),
        //   type: "MSDetail",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.print_preview"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.edit"),
        //   type: "MSDetail",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.addition"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.delete"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.detail"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.markup"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.data"),
        //   type: "MSDetail",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.processing"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        {
          topBtnName: this.$t("message.bhView.topBtnDownList.view"),
          type: "MSDetail",
          downList: [
            {
              itemName: this.$t(
                "message.bhView.topBtnDownList.selectDisplayItems"
              ),
              // disableByResult: true,
              disabled: true,
            },
            {
              itemName: this.$t("message.bhView.topBtnDownList.selectCheck"),
              disabled: true,
            },
          ],
        },
      ],

      // 目視/非破壊経歴（詳細）
      sixthDetailBtnDownList: [
        {
          topBtnName: this.$t("message.bhView.topBtnDownList.view"),
          type: "sixthDetail",
          downList: [
            {
              itemName: this.$t("message.bhView.topBtnDownList.selectDisplayItems"),
              // disableByResult: true,
              disabled: true,
            },
            {
              itemName: this.$t("message.bhView.topBtnDownList.selectCheck"),
              disabled: true,
            },
          ],
        },
      ],

      // 装置情報閲覧
      topYLBtnDownList: [
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.printing"),
        //   type: "YL",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.print_preview"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        {
          topBtnName: this.$t("message.bhView.topBtnDownList.reading"),
          type: "YL",
          downList: [
            {
              itemName: this.$t("message.reading.cadView.contextMenu.menu0"),
              disabled: true,
            },
            // {
            //   itemName: this.$t("message.reading.cadView.contextMenu.menu1"),
            //   disabled: false,
            // },
            {
              itemName: this.$t("message.reading.cadView.contextMenu.menu2"),
              disabled: true,
            },
            {
              itemName: this.$t("message.reading.cadView.contextMenu.menu3"),
              disabled: true,
            },
            {
              itemName: this.$t("message.reading.cadView.contextMenu.menu4"),
              disabled: true,
            },
            {
              itemName: this.$t("message.reading.cadView.contextMenu.menu5"),
              disabled: true,
            },
            // {
            //   itemName: this.$t("message.reading.cadView.contextMenu.menu6"),
            //   disabled: false,
            // },
            {
              itemName: this.$t("message.reading.cadView.contextMenu.menu7"),
              disabled: true,
            },
          ],
        },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.data"),
        //   type: "YL",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.sort"),
        //     //   disabled: false,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.screen"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        {
          topBtnName: this.$t("message.bhView.topBtnDownList.view"),
          type: "YL",
          downList: [
            {
              itemName: this.$t(
                "message.bhView.topBtnDownList.selectDisplayItems"
              ),
              // disableByResult: true, //-first
              disabled: true,
            },
          ],
        },
      ],

      // 基本仕様
      topBSDownList: [
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.printing"),
        //   type: "BS",
        //   downList: [],
        // },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.reading"),
        //   type: "BS",
        //   downList: [
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.addition"),
        //     //   disabled: true,
        //     // },
        //     // {
        //     //   itemName: this.$t("message.bhView.topBtnDownList.delete"),
        //     //   disabled: false,
        //     // },
        //   ],
        // },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.data"),
        //   type: "BS",
        //   downList: [],
        // },
        // {
        //   topBtnName: this.$t("message.bhView.topBtnDownList.view"),
        //   type: "BS",
        //   downList: [],
        // },
      ],
      downBtnActive: null,
      valuePlant: "",
      macName: "",
      name: "",
      numberData: 0,
      leftTabelRow: {},
      leftReadTabelRow: {},
      DAFlg: false,
      DDFlg: false,
      CBFlg: false,
      TabelCompontensFlag: false,
      MSTabelCompontensFlag: false,
      MSDetailTabelCompontensFlag: false,
      MSDetailTabelCompontensFlag1: false,

      sixthDetailTabelCompontensFlag: false,
      sixthDetailTabelCompontensFlag1: false,

      ReadingTabelCompontensFlag: false,
      AdditionalInformationFlag: false,
      ChartsConfigFlag: false,
      downBtnActiveX: null,
      readingName: {
        macName: "",
        name: "",
      },
      styleOptionsValue: 3,

      AddBasicStyleIsShow: false,
      AddBasicStylePipingIsShow: false,
    };
  },

  computed: {
    toMarkupBtnIsDisable() {

      if (this.activeName === "first") {
        let tempCode = this.$store.state.bhStyleCode;
        if (tempCode == 2) return false;
      } else if (this.activeName === "second") {
        let tempCode = this.$store.state.msStyleCode;
        if (tempCode == 2) return false;
      } else if (this.activeName === "third") {
        let tempCode = this.$store.state.msDetailStyleCode;
        if (tempCode == 2) return false;
      }
      return true;
    },

  },

  // 注册组件
  components: {
    LeftContent,
    BHCompontens,
    MSCompontens,
    MSDetailCompontens,
    SixthCompontens,
    ReadingCompontens,
    DAView,
    DDView,
    CBView,
    BHTabelCompontens,
    AdditionalInformation,
    ChartsConfig,
    MSTabelCompontens,
    ReadingTabelCompontens,
    BSCompontens,
    MSDetailTabelCompontens,
    MSInspectTabelCompontens,

    sixthDetailTabelCompontens,
    sixthInspectTabelCompontens,

    AddBasicStyleMachine,
    AddBasicStylePiping,
    PanOrView,
  },
  // 监听指定值，只有指定值变化，才会触发
  watch: {
    activeName: (newVal, oldVal) => {
      // 监听到 macNameb 变化后的回调处理逻辑
      if (newVal == 'fourth') {
        showLoading();
      }
    }
  },
  // 里面的函数只有调用才会执行（实时计算）里面是定义的方法
  methods: {

    // 全景图
    panorFn(flg) {
      this.panorShow = flg;
      if (this.panorShow) {
        this.$refs.PanOrViewRef.initFn();
      }
      console.log('start');
      // setTimeout(() => {
      //   this.panorShow = !this.panorShow;
      // }, 3000);
    },

    changeCheckBox(e) {
      console.log('EEE', e);
      if (e.indexOf(2) != -1) {
        this.sixthDetailBtnDownList[0].downList[0].disabled = true;
      } else {
        this.sixthDetailBtnDownList[0].downList[0].disabled = false;
      }
    },

    changeBtnTxt(e) {
      console.log('EEE', e);
      if (e == 1) {
        this.topBtnDownList[1].downList[2].disabled = true;
      } else {
        this.topBtnDownList[1].downList[2].disabled = false;
      }
    },
    checkTopMenuByUserData() {
			var bhViewPermiss = this.$hasEditPermission('/BHView');

      this.topBtnDownList.forEach(listE => {
        listE.downList.forEach(subE => {
          if (subE.disableByResult) {
            subE.disabled = bhViewPermiss
          }
        })
      })

      this.topMsBtnDownList.forEach(listE => {
        listE.downList.forEach(subE => {
          if (subE.disableByResult) {
            subE.disabled = bhViewPermiss
          }
        })
      })

      this.topMsDetailBtnDownList.forEach(listE => {
        listE.downList.forEach(subE => {
          if (subE.disableByResult) {
            subE.disabled = bhViewPermiss
          }
        })
      })

      this.topYLBtnDownList.forEach(listE => {
        listE.downList.forEach(subE => {
          if (subE.disableByResult) {
            subE.disabled = bhViewPermiss
          }
        })
      })

      this.topBSDownList.forEach(listE => {
        listE.downList.forEach(subE => {
          if (subE.disableByResult) {
            subE.disabled = bhViewPermiss
          }
        })
      })
    },


    changeToScene() {
      var { href } = this.$router.resolve({
        name: "SCENE",
      });

      let newWindow = window.open(href, "_blank");
    },

    beforeLeaveFn(activeName, oldActiveName) {
      return this.isNavLeave
    },

    handleClick(tab, event) {
      eventBus.$emit('getBasicStyleCompontensCurrent_EventBus');	//	基本仕样

      let Fn = () => {
        this.isNavLeave = true;
        this.activeName = tab.name;
        if (
          !this.$store.state.macNameb &&
          this.activeName == "first"
        ) {
          console.log("触发InitTableFirstData");
          eventBus.$emit("InitTableFirstData");
          setTimeout(() => {
            this.isNavLeave = false;
          }, 500);

          return;
        }
        if (
          this.$store.state.macNameb &&
          this.activeName != "fourth"
        ) {
          console.log("触发SelectTableRow");

          if (this.$store.state.isCurrentNext) {
            eventBus.$emit("SelectTableRow");
          }

          setTimeout(() => {
            this.isNavLeave = false;
          }, 500);

          return;
        }
      }
      /**
       * 2。  记录当前函数。
       */
      if (this.$store.state.isCurrentNext) {
        Fn();
      } else {
        /**
          * 4-1。   记录原来该运行的函数。
          * 4-2。   执行保存弹出框操作。   
          */

        this.$store.commit("changeIsCurrentFn", Fn);

        eventBus.$emit('EventBusBasicStyleCompontensSaveFn');	//	基本仕样
      }

    },
    //下拉菜单标记颜色
    BtnActive(index) {
      this.downBtnActive = index;
    },
    // 装置切换
    changePlanValue(val) {
      this.valuePlant = this.$store.state.plantName;
    },
    //获取左侧表格行数据
    getTableRow(val) {
      // 如果左侧列表为空  则赋值初始化数据~~
      this.leftTabelRow = val
        ? val
        : {
          ctgCode: null,
          dwgID: null,
          impCode: null,
          indoorAddr: "",
          indoorID: "",
          macCode: 0,
          macName: "",
          macType: 1,
          name: "",
          pltCode: this.$store.state.pltCode,
        };
      this.$store.commit("changeMacCode", this.leftTabelRow.macCode);
      this.$store.commit("changeMacName", this.leftTabelRow.name);
      this.$store.commit("changeMacNameb", this.leftTabelRow.macName);
      this.$store.commit("changeRowCtgCode", this.leftTabelRow.ctgCode);
    },
    getReadTableRow(row) {
      this.leftReadTabelRow = row ? row : {};
    },
    //清除
    clearBhTabel() {
      // this.numberData = 0;
    },
    ClearDataFunction() {
      this.$store.commit("changeMacCode", "");
      this.$store.commit("changeMacName", "");
      this.$store.commit("changeMacNameb", "");
    },
    //获取表格点数
    getNumberData(val) {
      this.numberData = val;
    },
    //二级菜单点击事件
    dropDownMenu(item, type) {
      console.log(item, type);
      //打开图表设定
      if (
        item.itemName ==
        this.$t("message.bhView.topBtnDownList.selectDisplayItems") &&
        type == "BH"
      ) {
        this.TabelCompontensFlag = true;
      } else if (
        item.itemName ==
        this.$t("message.bhView.topBtnDownList.additionalInformation") &&
        type == "BH"
      ) {
        this.AdditionalInformationFlag = true;
      } else if (
        item.itemName ==
        this.$t("message.bhView.topBtnDownList.chartSetting") &&
        type == "BH"
      ) {
        this.ChartsConfigFlag = true;
      } else if (
        item.itemName ==
        this.$t("message.bhView.topBtnDownList.pointDisplay") &&
        type == "BH"
      ) {
        this.DAFlg = true;
      } else if (
        item.itemName ==
        this.$t("message.bhView.topBtnDownList.ballSwitch") &&
        type == "BH"
      ) {
        this.DDFlg = true;
      } else if (
        item.itemName ==
        this.$t("message.bhView.topBtnDownList.errorAlarmValue") &&
        type == "BH"
      ) {
        console.log('2222222222');
        this.CBFlg = true;
      }



      if (
        item.itemName ==
        this.$t("message.bhView.topBtnDownList.selectDisplayItems") &&
        type == "MS"
      ) {
        this.MSTabelCompontensFlag = true;
      }

      if (type == "YL") {
        // fitdraw
        if (
          item.itemName == this.$t("message.reading.cadView.contextMenu.menu7")
        ) {
          this.$refs.readingCompontens.onCadContextMenuClick({
            tag: "fit-draw",
          });
        } else if (
          item.itemName == this.$t("message.reading.cadView.contextMenu.menu0")
        ) {
          this.activeName = "fifth";
          this.handleClick();
        } else if (
          item.itemName == this.$t("message.reading.cadView.contextMenu.menu3")
        ) {
          eventBus.$emit('goPlanView', 3, 'PlanVIew')
        } else if (
          item.itemName == this.$t("message.reading.cadView.contextMenu.menu5")
        ) {
          this.$refs.readingCompontens.onMenuClickFromExternal("bh-reading");
        } else if (
          item.itemName == this.$t("message.reading.cadView.contextMenu.menu4")
        ) {
          this.$refs.readingCompontens.onMenuClickFromExternal("check-result");
        } else if (
          item.itemName == this.$t("message.reading.cadView.contextMenu.menu2")
        ) {
          this.$refs.readingCompontens.onMenuClickFromExternal("draw-style");
        } else if (
          item.itemName ==
          this.$t("message.bhView.topBtnDownList.selectDisplayItems")
        ) {
          this.ReadingTabelCompontensFlag = true;
        }
      }

      if (type == "MSDetail") {
        if (
          item.itemName ==
          this.$t("message.bhView.topBtnDownList.selectDisplayItems")
        ) {
          this.MSDetailTabelCompontensFlag = true;
        } else if (
          item.itemName ==
          this.$t("message.bhView.topBtnDownList.selectCheck")
        ) {
          this.MSDetailTabelCompontensFlag1 = true;
        }
      }

      // 基本式样
      if (type == "BS") {
        if (
          item.itemName == this.$t("message.bhView.topBtnDownList.addition")
        ) {
          this.$store.state.macType == 1
            ? (this.AddBasicStyleIsShow = true)
            : (this.AddBasicStylePipingIsShow = true);
        }
      }

      // 机器别计划
      if (type == 'sixthDetail') {
        if (item.itemName == this.$t("message.bhView.topBtnDownList.selectDisplayItems")) {
          this.sixthDetailTabelCompontensFlag = true;
        }
        if (item.itemName == this.$t("message.bhView.topBtnDownList.selectCheck")) {
          this.sixthDetailTabelCompontensFlag1 = true;
        }
      }

    },

    /**
     * 来自履历图纸右键菜单项
     * e 菜单项标记
     * e2 设备数据
     */
    changeByReadingSvg(e, e2) {
      this.$nextTick(() => {
        if (e === "bh-reading") {
          this.activeName = "first";
          this.handleClick();
        } else if (e === "check-result") {
          this.activeName = "second";
          this.handleClick();
        } else if (e === "base-style") {
          this.activeName = "fifth";
          this.handleClick();
        } else {
          this.$alert("見つかりません === " + e2.dmgCode, '', {
            confirmButtonText: 'OK',
            type: 'warning',
          });

        }
      });
      //}
    },
    //获取阅览下拉框内的macname
    getMacName(data) {
      this.readingName.macName = data.macName;
      this.readingName.name = data.macNumb;
      this.$store.commit("changeMacName", data.macName ? data.macName : "");
      this.$store.commit("changeMacNameb", data.macNumb ? data.macNumb : "");
      this.$store.commit("changeMacCode", data.macCode ? data.macCode : "");
      this.$store.commit("changeColorOptionsCode", "");
      this.$store.commit("changeJudgCode", "");
      this.$store.commit("changeCheckCode", "");
      this.$store.commit("changePositionCode", "0");
      this.$refs.LeftContent.changeRadioSelect(
        data.macType ? data.macType.toString() : null
      );
    },

    /**
     * 根据履历点击项更新 机器（1） or 配管（2）
     */
    changeRadioSelect(e) {
      this.$refs.LeftContent.changeRadioSelect(e ? e.toString() : null);
    },
    ChangeSelectViewValueFun(val) {
      this.styleOptionsValue = parseInt(val);
    },
    /**
     * markup按钮 跳转CADView
     */
    async onToMarkClick() {

      // console.log(this.$refs.SixthCompontensRef.checkList, this.$refs.SixthCompontensRef.checkList.length == 1 && this.$refs.SixthCompontensRef.checkList[0] == 3);
      if (this.leftTabelRow == null) {
        this.$alert(this.$t("message.bhView.turnToCadViewNoDrawTip"), '', {
          confirmButtonText: 'OK',
          type: 'warning',
        });

        return;
      }

      let tempRadioType = -1;
      if (this.activeName === "first") {
        tempRadioType = 1;
      } else if (this.activeName === "second") {
        tempRadioType = 0;
      } else if (this.activeName === "third") {
        if (this.$store.state.msDetailRadio == "2") tempRadioType = 0;
        else if (this.$store.state.msDetailRadio == "1") tempRadioType = 2;
      } else if (this.activeName === "fifth") {
        tempRadioType = 3
      } else if (this.activeName === "sixth") {
        if (this.$refs.SixthCompontensRef.checkList.length == 1 && this.$refs.SixthCompontensRef.checkList[0] == 3) {
          tempRadioType = 1
        } else {
          tempRadioType = 0
        }
      }

      let dataJson = {
        pltCode: Number(this.$store.state.pltCode),
        MeType: this.activeName == 'first' ? 1 : this.activeName == 'second' ? 2 : this.activeName == 'third' ? 3 : 0,
        dmgCode: this.$store.state.macCode,
      }
      let res = await getMachineDwgId(dataJson);

      var { href } = this.$router.resolve({
        name: "CAD",
        query: {
          // id: this.leftTabelRow.dwgID,
          id: res.data.data,
          radioType: tempRadioType,
          macNumb: this.$store.state.macNameb,
          macCode: this.$store.state.macCode,
          pltCode: Number(this.$store.state.pltCode),
        },
      });
      window.open(href, "_blank");
    },
  },
  // 创建完毕状态(里面是操作)
  created() {
    this.$socket.start();
  },
  // 挂载结束状态(里面是操作)
  mounted() {
    const path = this.$route.query.path;
    const macName = this.$route.query.macName;
    const MacType = this.$route.query.macType;
    const PltCode = this.$route.query.pltCode;
    if (path == 'first' || path == 'fifth') {
      this.isNavLeave = true;
      this.activeName = path;

      setTimeout(() => {
        this.isNavLeave = false;
        let D = {
          name: macName,
          macType: Number(MacType),
          pltCode: Number(PltCode)
        }
        eventBus.$emit('Mods', D);
        hideLoading();
      }, 1500);
      showLoading();
    }



    this.$nextTick(function () {
      window.addEventListener(
        "resize",
        () => {
          return (() => {
            let heightStyle = $(".page-view").height() - 200;
            this.tableHeight = heightStyle;
          })();
        },
        false
      );
      if ($(".LeftMenu").width() == 64) {
        $(".View").width($(".Content").width() - 64);
      } else if ($(".LeftMenu").width() == 192) {
        $(".View").width($(".Content").width() - 192);
      }
    });
    if (this.activeName != "fourth") {
      eventBus.$emit("leftStart", true);
    } else {
      eventBus.$emit("leftStart", false);
    }
    this.checkTopMenuByUserData();
  },
  // 销毁前状态(里面是操作)
  beforeDestroy() {
    this.$off("getNumberData");
    eventBus.$off("BHTabelRowPush");
    window.removeEventListener("resize", function () { });
  },
};
</script>
<style lang="scss" scoped>
.View {
  width: calc(100% - 192px);
  height: 100%;

  .all-content-warrper {
    width: 100%;
    height: calc(100% - 55px);
  }

  .title-view {
    width: calc(100% - 48px);
    background: #f8f8f8;
    border-bottom: 1px solid #e1e1e1;
    margin-left: 24px;

    .top-tab {
      display: flex;
      width: 100%;
      height: 55px;
    }

    .btn-box {
      display: flex;
      align-items: center;
      justify-content: flex-start;
    }

    .top-btn-view {
      height: 48px;
      display: flex;
      align-content: center;
      // justify-content: space-evenly;

      .tab-btn {
        min-width: 60px;
        height: 24px;
        text-align: left;
        line-height: 24px;
        color: rgba(0, 0, 0, 0.65);
        margin-right: 2px;
        border-radius: 2px;
        transition: 0.5s;
      }

      .tab-btn:hover {
        background: rgba(33, 61, 73, 0.05);
      }

      .downBtnActive {
        background: rgba(33, 61, 73, 0.05);
      }
    }

    .bottom {
      width: 100%;
      height: 48px;
      display: flex;
      align-items: center;
      justify-content: space-between;

      // margin-left: 120px;
      .bottom-left-view {
        display: flex;
        align-items: center;
        justify-content: flex-start;
        height: 52px;
      }

      .bottom-right-view {
        display: flex;
        align-items: center;
        justify-content: flex-end;
        height: 52px;

        button {
          min-width: 52px;
          height: 24px;
          border-radius: 4px;
          // border: 1px solid #d3d3d3;
          margin-left: 16px;
        }

        .bg-bottom-btn {
          // background: #106ebe;
          // color: #ffffff;
          padding: 0 8px;
        }

        .edit-btn {
          color: #fff;
          background: #bc000f;
          border: 0 none;
        }
      }

      .b-input {
        display: flex;
        align-items: center;
        height: 100%;
        margin-right: 24px;

        .b-input-label {
          font-size: 14px;
          color: rgba(0, 0, 0, 0.85);
          height: 24px;
          line-height: 24px;
        }

        .selectInput {
          width: 224px;
          height: 24px;
        }

        .selectInputlong {
          width: 384px;
          margin-left: 8px;

          ::v-deep .el-input__inner {
            width: 384px;
          }
        }

        ::v-deep .el-input__inner {
          width: 224px;
          height: 24px;
          color: rgba(0, 0, 0, 0.65);
          background: #f8f8f8;
        }

        ::v-deep .el-input__icon {
          line-height: 24px;
        }
      }

      .DViewer {
        margin-left: 8px;
        min-width: 52px;
        height: 24px;
        // border-radius: 4px;
        // border: 1px solid #d9d9d9;
        display: flex;
        align-items: center;
        justify-content: center;

        // cursor: pointer;
        .iconfont {
          height: 24px;
          line-height: 24px;
          font-size: 24px;
          margin: 0 4px;
          color: #2a7190;
          cursor: pointer;
        }
      }
    }
  }

  .leftTabel-rightTabel-lineContent {
    width: 100%;
    height: calc(100% - 52px);
    display: flex;
    justify-content: flex-start;

    .left {
      width: 264px;
      height: 100%;
    }

    .right {
      width: calc(100% - 264px);
      padding: 0 16px;
      height: 100%;
      display: flex;
      flex-direction: column;
    }

    .wide-right {
      width: 100%;
      padding: 0 16px 0 24px;
    }
  }
}

.bh-tab {
  width: 100%;

  // height: 100%;
  ::v-deep .el-tabs__header {
    margin: 14px 24px 0 24px;
    width: calc(100% -48px);
  }

  ::v-deep .el-tabs__content {
    height: calc(100% - 55px);
  }

  ::v-deep #pane-first {
    height: 100%;
  }

  ::v-deep #pane-second {
    height: 100%;
  }

  ::v-deep #pane-third {
    height: 100%;
  }
}

.drop-btn {
  background: transparent;
  border: 0 none;
}

::v-deep .el-button.is-disabled,
::v-deep .el-button.is-disabled:hover {
  background: #ebeef5 !important;
  color: #c0c4cc !important;
}

// ::v-deep .el-dropdown-menu .el-button.is-disabled,
//   ::v-deep .el-dropdown-menu .el-button.is-disabled:hover {
//     background: transparent !important;
//   }
.panor {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 999;
  width: 100%;
  height: 100%;
  // background-color: red;

}
</style>
